<template>
    <div v-loading="loading" element-loading-text="拼命加载中">
        <div class="content_top">
            配送设置
        </div>
        <div class="content">
            <el-form ref="form" :model="form" :rules="rules" label-width="180px" size="mini">
                <el-form-item label="营业开始时间：" prop="startTime">
                    <el-time-picker v-model="form.startTime" value-format="HH:mm" :picker-options="{format: 'HH:mm'}"/>
                </el-form-item>
                <el-form-item label="营业结束时间：" prop="endTime">
                    <el-time-picker v-model="form.endTime" placeholder="选择时间" value-format="HH:mm"  :picker-options="{format: 'HH:mm'}">
                    </el-time-picker>
                </el-form-item>
                <el-form-item label="送达需要时长（分钟）：" prop="timeLength">
                    <el-input-number v-model="form.timeLength" :min="0" style="width: 400px;"></el-input-number>
                </el-form-item>
                <el-form-item label="配送费用（元）：" :precision="2" prop="fee">
                    <el-input-number v-model="form.fee" :min="0" style="width: 400px;"></el-input-number>
                </el-form-item>
                <el-form-item label="配送距离（米）：" prop="distance">
                    <el-input-number v-model="form.distance" :min="0" style="width: 400px;"></el-input-number>
                </el-form-item>
                <el-form-item label="满多少免配送费（元）：" prop="fullFree">
                    <el-input-number v-model="form.fullFree" :min="0" style="width: 400px;"></el-input-number>
                </el-form-item>
                <el-form-item label="配送说明：" prop="explained">
                    <el-input v-model="form.explained" type="textarea" :rows="3" style="width: 400px;"></el-input>
                </el-form-item>
                <el-form-item label="送达时间提示：" prop="distributionTimeTip">
                    <el-input v-model="form.distributionTimeTip" type="textarea" :rows="3" style="width: 400px;"></el-input>
                </el-form-item>
                <el-form-item style="text-align: left">
                    <el-button type="primary" @click="onSubmit">保存</el-button>
                </el-form-item>
            </el-form>
        </div>
    </div>
</template>

<script>

    import {info, save} from "@/api/config/distime";

    export default {
        name: 'system-disconfig',
        data() {
            return {
                loading: false,
                form: {
                },
                rules: {
                    startTime: [
                        {required: true, message: '请输入营业开始时间', trigger: 'blur'},
                    ],
                    endTime: [
                        {required: true, message: '请输入营业结束时间', trigger: 'blur'},
                    ],
                    timeLength: [
                        {required: true, message: '请输入送达需要时长', trigger: 'blur'},
                    ],
                    fee: [
                        {required: true, message: '请输入配送费用', trigger: 'blur'},
                    ],
                    distance: [
                        {required: true, message: '请输入配送距离', trigger: 'blur'},
                    ],
                    fullFree: [
                        {required: true, message: '请输入满多少免配送费', trigger: 'blur'},
                    ],
                    explained: [
                        {required: true, message: '请输入配送说明', trigger: 'blur'},
                    ],
                    distributionTimeTip: [
                        {required: true, message: '请输入配送说明', trigger: 'blur'},
                    ],
                }
            }
        },
        mounted() {
            this.loadConfig()
        },
        methods: {
            async loadConfig() {
                this.loading = true
                let res = await info()
                this.loading = false
                res.data.startTime = res.data.startTime.substring(10).substring(0, 6)
                res.data.endTime = res.data.endTime.substring(10).substring(0, 6)
                this.form = res.data;
            },
            onSubmit() {
                this.$refs.form.validate((valid) => {
                    if (valid) {
                        this.save()
                    } else {
                        return false;
                    }
                });
            },
            async save() {
                this.loading = true;
                let params = JSON.parse(JSON.stringify(this.form))
                let res = await save(params)
                this.loading = false
                if (res.code !== '0') {
                    return this.$notify.error({title: '消息', message: res.message})
                }
                this.$notify({title: '消息', message: '保存成功', type: 'success'});
            }
        }
    }
</script>

<style scoped>

</style>